<template>
  <div class="barChart">
     <el-row>
  <el-col :span="8"><div class="grid-content bg-purple" style="padding:20px"><barChart1 :data="data" /></div></el-col>
  <el-col :span="8"><div class="grid-content bg-purple-light" style="padding:20px"><barChart2 :data="data"/></div></el-col>
  <el-col :span="8"><div class="grid-content bg-purple" style="padding:20px"><barChart3 /></div></el-col>
</el-row>
  </div>
</template>
<script>

import barChart1 from '@/views/quota/echarts/barChart/barChart1.vue'
import barChart2 from '@/views/quota/echarts/barChart/barChart2.vue'
import barChart3 from '@/views/quota/echarts/barChart/barChart3.vue'

export default {
  name:"index",
  components: { barChart1, barChart2, barChart3 },
  data() {
    return {
      data:[]
    }
  },
  computed: {},
  watch: {},
  created() {
      this.data = JSON.parse(this.$route.query.data)
  },
  mounted() {
      console.log('this.data')
      console.log(this.data)
  },
  methods: {
    

  }
}

</script>
<style lang="less">
.barChart {
  padding: 20px 0;
  background-color: #F0F2F5;

  .chart {
    background-color: #fff;
  }
}
.demonstration {
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
}
</style>
